<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>2.新制作一个页面，要求：
       2.1 至少包含以下元素：3个DIV,标题，5个P标签，图片，列表 
       2.2 分别实现 id,类，标签三种方式查找以上元素</title>
	</head>
	<style type="text/css">
		#div1{
			width: 500px;
			height: 500px;
			background-color: aqua;
		}
		#div2{
			width: 400px;
			height: 400px;
			background-color: red;
		}
		#div3{
			width: 300px;
			height: 300px;
			background-color: green;
		
		}
		
	</style>
	<body>
		<div id="div1">
			<div id="div2">
				<div id="div3">
					<img src="img/1.jpg" class="img1" width="100px" height="100px" >
					<ul>
						<li><p>张三</p></li>
						<li><p>李四</p></li>
						<li><p>王五</p></li>
						<li><p>赵六</p></li>
						<li><p>零六</p></li>
					</ul>
				</div>
			</div>
		</div>
		<button type="button" onclick="getdiv();">获取div元素</button>
		
	</body>
	<script type="text/javascript">
		function getdiv(){
			var div1obj =document.getElementById('div1');
			console.log(div1obj);
			var div2obj =document.getElementById('div2');
			console.log(div2obj);
			var div3obj =document.getElementById('div3');
			console.log(div3obj);
			var classobj =document.getElementsByClassName('img1')
			console.log(classobj);
			var pobj =document.getElementsByTagName('p')
			console.log(pobj);
			var ulobj =document.getElementsByTagName('ul')
			console.log(ulobj);
			var liobj =document.getElementsByTagName('li')
			console.log(liobj);
			
		}
		
	</script>
</html>
